<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8" />
<title>考勤系统后台</title>

<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />

<link
	href="${pageContext.request.contextPath }/dist/css/bootstrap.min.css"
	rel="stylesheet" />
<link
	href="${pageContext.request.contextPath }/dist/css/bootstrap-responsive.min.css"
	rel="stylesheet" />

<link
	href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600"
	rel="stylesheet" />
<link
	href="${pageContext.request.contextPath }/dist/css/font-awesome.css"
	rel="stylesheet" />

<link href="${pageContext.request.contextPath }/dist/css/adminia.css"
	rel="stylesheet" />
<link
	href="${pageContext.request.contextPath }/dist/css/adminia-responsive.css"
	rel="stylesheet" />

<link
	href="${pageContext.request.contextPath }/dist/css/pages/plans.css"
	rel="stylesheet" />

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body>

	<div class="navbar navbar-fixed-top">

		<div class="navbar-inner">

			<div class="container">

				<a class="btn btn-navbar" data-toggle="collapse"
					data-target=".nav-collapse"> <span class="icon-bar"></span> <span
					class="icon-bar"></span> <span class="icon-bar"></span>
				</a> <a class="brand" >考勤系统</a>

				<div class="nav-collapse">

					<ul class="nav pull-right">
						<li><a href="#"><span class="badge badge-warning">7</span></a>
						</li>

						<li class="divider-vertical"></li>

						<li class="dropdown"><a data-toggle="dropdown"
							class="dropdown-toggle " href="#"> ${sessionScope.admin.adminName} <b
								class="caret"></b>
						</a>

							<ul class="dropdown-menu">
								<li><a href="#"><i class="icon-user"></i>
										账户设置 </a></li>

								<li><a href=""  data-toggle="modal" data-target="#change_admin_pwd"><i class="icon-lock"></i> 修改密码</a></li>

								<li class="divider"></li>

								<li><a href="${pageContext.request.contextPath }/AdminController?op=adminQuit"><i class="icon-off"></i> 退出</a></li>
							</ul></li>
					</ul>

				</div>
				<!-- /nav-collapse -->

			</div>
			<!-- /container -->

		</div>
		<!-- /navbar-inner -->

	</div>
	<!-- /navbar -->

	<div id="content">

		<div class="container">

			<div class="row">

				<div class="span3">

					<div class="account-container">

						<div class="account-avatar">
							<c:if test="${sessionScope.admin.adminAvatarAddr != null }">
									<a  data-toggle="modal" data-target="#updPic"><img src="${pageContext.request.contextPath}/EmployeesController?op=getPic&fileName=${sessionScope.admin.adminAvatarAddr}" alt="" class="thumbnail" id="adImg" ></a>
								</c:if>
								<c:if test="${sessionScope.admin.adminAvatarAddr == null }">
										<a  data-toggle="modal" data-target="#updPic"><img src="${pageContext.request.contextPath}/EmployeesController?op=getPic&fileName=labi.jpg" alt="" class="thumbnail" id="adImg"  ></a>
								</c:if>
						</div>
						<!-- /account-avatar -->

						<div class="account-details">

							<span class="account-name">${sessionScope.admin.adminName}</span>

							<span class="account-role">${sessionScope.admin.adminId}号管理员</span>

							<span class="account-actions"> <a href="javascript:;">个人资料</a>
								| <a href="javascript:;">账户管理</a>
							</span>

						</div>
						<!-- /account-details -->

					</div>
					<!-- /account-container -->

					<hr />

					<ul id="main-nav" class="nav nav-tabs nav-stacked">
					
					<li >
						<a href="${pageContext.request.contextPath }/Admin/Index.jsp">
							<i class="icon-home"></i>
							回主页
						</a>
					</li>
					
					<li>
						<a href="${pageContext.request.contextPath }/Admin/leaveApproval.jsp">
							<i class="icon-th-list"></i>
							请假审批
						</a>
					</li>
					
					<li >
						<a href="${pageContext.request.contextPath }/Admin/kaoqgl.jsp">
							<i class="icon-signal"></i>
							考勤管理	
						</a>
					</li>
					
					<li>
						<a href="${pageContext.request.contextPath }/Admin/yuanggl.jsp">
							<i class="icon-user"></i>
							员工管理							
						</a>
					</li>
					
					<li class="active">
						<a href="${pageContext.request.contextPath }/Admin/regAdmin.jsp">
							<i class="icon-user"></i>
							账户管理
						</a>
					</li>

				</ul>

					<hr />

					<div class="sidebar-extra">
						<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
							sed do eiusmod tempor incididunt ut labore et dolore magna
							aliqua. Ut enim ad minim veniam, quis nostrud.</p>
					</div>
					<!-- .sidebar-extra -->

					<br />

				</div>
				<!-- /span3 -->

				<div class="span9">

					<h1 class="page-title">
						<i class="icon-th-large"></i> 账户管理
					</h1>

					<div class="row">

						<div class="span9">

							<div class="widget">

								<div class="widget-header">
									<h3>新增或注销</h3>
								</div>
								<!-- /widget-header -->

								<div class="widget-content">

									<div class="tabbable">
										<ul class="nav nav-tabs">
											<li class="active"><a href="#addAdmin" data-toggle="tab">新增</a>
											</li>
											<li><a href="#eliminateadmin" data-toggle="tab">注销</a></li>
										</ul>

										<br />

										<div class="tab-content">
											<div class="tab-pane active" id="addAdmin">
												<form id="registerForm" class="form-horizontal"
													method="post" enctype="multipart/form-data">
													<fieldset>

														<div class="control-group">
															<label class="control-label" for="adminNameF1">用户名</label>
															<div class="controls">
																<input type="text" class="input-medium disabled"
																	name="adminNameF1" value="" id="adminName" />
																<p class="help-block">您的用户名注册成功后无法修改.</p>
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->

														<div class="control-group">
															<label class="control-label" for="adminPwd1F1">密码</label>
															<div class="controls">
																<input type="password" class="input-medium"
																	name="adminPwd1F1" value="" id="adminPwd" />
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->

														<div class="control-group">
															<label class="control-label" for="adminPwd2F1">验证密码</label>
															<div class="controls">
																<input type="password" class="input-medium"
																	name="adminPwd2F1" value="" id="adminRePwd"/>
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->

														<div class="control-group">
															<label class="control-label" for="myPhotoF1">上传头像</label>
															<div class="controls">
																<input type="file" class="input-medium" accept="image/gif,image/jpeg,image/jpg,image/png"
																	name="myPhotoF11" value="" id="pic"/>
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->
														<div class="control-group">
															<div class="controls" id="registerMessage">
																
															</div>
															<!-- /controls -->
														</div>
														<br />

														<div class="form-actions">
															<button type="button" class="btn btn-primary"
																id="register">注册</button>
															<button class="btn">取消</button>
														</div>
														<!-- /form-actions -->
													</fieldset>
												</form>
											</div>

											<div class="tab-pane" id="eliminateadmin">
												<form id="removeAdminForm" class="form-horizontal">
													<fieldset>

														<div class="control-group">
															<label class="control-label" for="adminNameF2">用户名</label>
															<div class="controls">
																<input type="text" class="input-medium disabled"
																	id="adminNameF2" name="adminNameF2" value=""  />
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->

														<div class="control-group">
															<label class="control-label" for="adminPwd1F2">密码</label>
															<div class="controls">
																<input type="password" class="input-medium"
																	id="adminPwd1F2" value="" name="adminPwd1F2" />
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->

														<div class="control-group">
															<label class="control-label" for="adminPwd2F2">验证密码</label>
															<div class="controls">
																<input type="password" class="input-medium"
																	id="adminPwd2F2" value=""/>
															</div>
															<!-- /controls -->
														</div>
														<!-- /control-group -->
															<div class="control-group">
															<div class="controls" id="removeMessage">
																
															</div>
															<!-- /controls -->
														</div>
														<br />

														<div class="form-actions">
															<button type="button" class="btn btn-primary" id="removeAdmin">注销</button>
															<button class="btn">取消</button>
														</div>
														<!-- /form-actions -->
													</fieldset>
												</form>
											</div>

										</div>

									</div>

								</div>
								<!-- /widget-content -->

							</div>
							<!-- /widget -->

						</div>
						<!-- /span9 -->

					</div>
					<!-- /row -->

				</div>
				<!-- /span9 -->

			</div>
			<!-- /row -->

		</div>
		<!-- /container -->

	</div>
	<!-- /content -->

	<div id="footer">

		<div class="container">
			<hr />
			<p>&copy; 2012 Go Ideate.</p>
		</div>
		<!-- /container -->

	</div>
	
	<!-- 修改密码的模态框 -->
	<div class="modal fade" id="change_admin_pwd" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<form class="form-horizontal" role="form" >
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">修改密码</h4>
					</div>
					<div class="modal-body">

						<div class="form-group">
							<label for="previousPwd" class="col-sm-2 control-label">原密码</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="previousPwd"
									name="previousPwd"  />
							</div>
						</div>
						<!-- <div class="form-group">
							<label for="previousRePwd" class="col-sm-2 control-label">再次输入</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="previousRePwd"
									name="previousRePwd" />
							</div>
						</div> -->
						<div class="form-group">
							<label for="newPwd" class="col-sm-2 control-label">新密码</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="newPwd"
									name="newPwd" />
							</div>
						</div>

						<div class="form-group">
							<label for="newRePwd" class="col-sm-2 control-label">确认输入</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="newRePwd"
									name="newRePwd" />
							</div>
						</div>

					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
						<button type="button" class="btn btn-primary" id="updateBtn">提交更改</button>
					</div>
				</div>
				<!-- /.modal-content -->
			</form>
		</div>
		<!-- /.modal -->
	</div>
	<!-- /footer -->
<!-- 修改头像模态框 -->
    <div class="modal fade" id="updPic">
		<div class="modal-dialog">
			<div class="modal-content" >
		
				<!-- 模态框头部 -->
				<div class="modal-header">
					<h4 class="modal-title">修改头像</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
			 <form id="updatePicForm" enctype="multipart/form-data" method="post">
				<!-- 模态框主体 -->
				<div class="modal-body">
				<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png" name="ep" />
				</div>
			</form>
			
				<!-- 模态框底部 -->
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-success" id="btup">确认修改</button>
				</div>
				
			
			</div>
		</div>
	</div>
	<!-- Le javascript
================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script
		src="${pageContext.request.contextPath }/dist/js/jquery-1.7.2.min.js"></script>

	<script src="${pageContext.request.contextPath }/dist/js/bootstrap.js"></script>

</body>
<script>
	//Ajax表单请求
	$(function() {
		$("#btup").click(function(){
			var formData = new FormData($("#updatePicForm")[0]);
			$.ajax({
				async : true,
				url : "${pageContext.request.contextPath}/AdminController?op=updatePic",
				type : "POST",
				data : formData,
				contentType : false,
				processData : false,
				success : function(admin) {
					var path = admin.adminAvatarAddr;
					$("#updPic").modal('hide');
					$("#adImg").attr("src","${pageContext.request.contextPath}/EmployeesController?op=getPic&fileName="+path+"&a=" + new Date().getTime());
				},
				error : function() {
					alert("异步请求失败");
				}
			})
		})
		//绑定点击事件
		$("#register").click(function() {
			if($("#adminName").val().trim()!="" && $("#adminPwd").val().trim()!="" && $("#adminRePwd").val().trim()!="" && $("#pic").val()!=""){
				
				
				//获取表单数据
				var formData = new FormData($("#registerForm")[0]);
				//发送Ajax请求
				$.ajax({
							async : true,
							url : "${pageContext.request.contextPath}/AdminController?op=addAdmin",
							type : "POST",
							data : formData,
							contentType : false,
							processData : false,
							success : function(result) {
								$("#adminName").val("");
								$("#adminPwd").val("");
								$("#adminRePwd").val("");
								$("#pic").val("");
								$("#registerMessage").text(result);
							},
							error : function() {
								alert("异步请求失败");
							}
						})
			}
						})
	})
	
	$(function() {
		//绑定点击事件
		$("#removeAdmin").click(function() {
			if($("#adminNameF2").val()!="" && $("#adminPwd1F2").val()!="" && $("#adminPwd2F2").val()!="" ){
							//获取表单数据
							var formData = $("#removeAdminForm").serialize();
							//发送Ajax请求
							$.ajax({
										async : true,
										url : "${pageContext.request.contextPath}/AdminController?op=removeAdmin",
										type : "POST",
										data : formData,
										contentType : "application/x-www-form-urlencoded",
										success : function(result) {
											if($("#adminNameF2").val() == "${sessionScope.admin.adminName}"){
												location.href="../adminLogin.jsp";
											}
											$("#adminNameF2").val("");
											$("#adminPwd1F2").val("");
											$("#adminPwd2F2").val("");
											$("#removeMessage").text(result);
										},
										error : function() {
											alert("异步请求失败");
										}
									})
			}
						})
	})
</script>
<script type="text/javascript">
	$(function(){
		//点击事件触发模态框
		$("#updateBtn").click(function(){
			
			//var adminName=${sessionScope.admin.adminName};
			var	previousPwd=$("#previousPwd").val();
			var	newPwd=$("#newPwd").val();
			var	newRePwd=$("#newRePwd").val();
			
			
		if(newPwd==newRePwd){
			//发送Ajax请求修改密码
			$.get("${pageContext.request.contextPath }/AdminController",{op:"change_admin_pwd",previousPwd:previousPwd,newPwd:newPwd,adminName:"${sessionScope.admin.adminName}"},function(flag){
				if(flag){
					//关闭模态框后并刷新数据
					$("#change_admin_pwd").modal('hide');
				}else{
					alert("账户密码错误,修改失败!")
				}
			},"json")
		}else{
			alert("两次密码不一致");
		}
		
		})
	})
</script>
</html>
